<template>
    <div>
        <h2>门店修改</h2>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td>门店名称</td>
                    <td>
                        <input type="text" v-model="model.ShopName">
                    </td>
                </tr>



                <tr>
                    <td>时间</td>
                    <td>
                        <input type="date" v-model="model.CreateTime">
                    </td>
                </tr>



                <tr>
                    <td>服务范围</td>
                    <td>
                     <select type="date" v-model="model.ShopType">
                        <option value="-1">请选择</option>
                        <option value="免费洗车">免费洗车</option>
                        <option value="免费停车">免费停车</option>
                        <option value="早餐早点">早餐早点</option>
                     </select>
                    </td>
                </tr>


                <tr>
                    <td>店主</td>
                    <td>
                        <input type="text"  v-model="model.Name">
                       
                    </td>
                </tr>


                  

                <tr>
                    <td>联系电话</td>
                    <td>
                        <input type="text" maxlength="11"  v-model="model.Phone">
                    </td>
                </tr>


                <tr>
                    <td>门店介绍</td>
                    <td>
                        <textarea  cols="30" rows="10"  v-model="model.JieShao"></textarea>
                    </td>
                </tr>

    
              

                <tr>
                    <td>门店地址</td>
                    <td>
                        <input type="text" v-model="model.Adder">
                    </td>
                </tr>


                <tr>
                    <td>状态</td>
                    <td>
                       <input type="radio" name="status" value="1"  v-model="model.State">启用
                       <input type="radio"  name="status" value="0" v-model="model.State">禁用
                    </td>
                </tr>


                <tr>
                    <td>门店Logo</td>
                    <td>
                      <img :src="model.Photo" alt="" width="100" height="100">
                    </td>
                </tr>



                <tr>
                    <td>门店图片</td>
                    <td>
                       <input type="file" @change="changeImg">
                    </td>
                </tr>


                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="修改"  @click="ok" class="btn btn-success">
                    </td>
                </tr>


            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue';
import axios from 'axios';
import { useRoute, useRouter } from 'vue-router';
import { M } from 'vite/dist/node/types.d-aGj9QkWt';
const route = useRoute();
const router = useRouter();




//图片上传

const changeImg = (e: any) => {
  let obj = e.target.files[0];
  let f = new FormData();
  f.append('file', obj);
 


axios({

url: 'https://localhost:7276/api/Shop/UpFiles',
method: 'post',
data: f,
})
.then((res) => {
  console.log(res);
  model.Photo = res.data;
})
.catch((err) => {
  console.log(err);
});

}



onMounted(() => {
    getAll();
})


const getAll = () => {
    axios({
        url: 'https://localhost:7276/api/Shop/ShopAll',
        method: 'get',
        params: {
            Id: route.query.Id
        }
    }).then((res) => {
        console.log(res);
        model.ShopName = res.data.ShopName;
        model.CreateTime = res.data.CreateTime.substring(0, 10);
        model.ShopType = res.data.ShopType;
        model.Name = res.data.Name;
        model.Phone = res.data.Phone;
        model.JieShao = res.data.JieShao;
        model.Adder = res.data.Adder;
        model.State = res.data.State;
        model.Photo = res.data.Photo;

    }).catch((err) => {
        console.log(err);
    })
}

//修改门店
let model = reactive({
    Id:route.query.Id,
  "ShopName":'',
  "CreateTime": '',
  "ShopType": -1,
  "Name": '',
  "Phone": '',
  "JieShao": '',
  "Adder": '',
  "State": 1,
  "Photo": '',
})



const ok = () => {
    axios({
        url: 'https://localhost:7276/api/Shop/ShopUpd',
        method: 'put',
        data: model,
    })
    .then((res) => {
        console.log(res);
        if (res.data > 0) {
            alert('修改成功');
            router.push('/ShopList');
        }
        else    {
            alert('修改失败');
            return;
        }
    })
    .then((err) => {
        console.log(err);
    })
}

</script>

<style scoped></style>